import {SafeAreaView, StatusBar, StyleSheet, useColorScheme} from "react-native";
import {Colors} from "react-native/Libraries/NewAppScreen";
import {NavigationContainer} from "@react-navigation/native";
import {MainStack} from "./navigation/MainStack";
import {MD3LightTheme, PaperProvider} from "react-native-paper";

export const App = () => {
    const isDarkMode = useColorScheme() === 'dark';

    const backgroundStyle = {
        // backgroundColor: !isDarkMode ? Colors.darker : Colors.lighter,
        // !isDarkMode ? 'light-content' : 'dark-content'
        backgroundColor: Colors.lighter
    };

    return (
        <PaperProvider theme={MD3LightTheme}>
            <SafeAreaView style={{...backgroundStyle, ...styles.safeView}}>
                <StatusBar barStyle={`dark-content`}
                           backgroundColor={backgroundStyle.backgroundColor}/>
                <NavigationContainer>
                    <MainStack/>
                </NavigationContainer>
            </SafeAreaView>
        </PaperProvider>
    );
}

const styles = StyleSheet.create({
    safeView: {
        flex: 1
    }
});
